import React, {PureComponent} from 'react';
import "./index.less";
import wudu from '../../assets/images/tarber/weidu.png'
import add from '../../assets/images/tarber/add.png'
import dw from '../../assets/images/tarber/dw.png'
import operate from '../../assets/images/tarber/operate.png'
const category = [
    {
        id: 1,
        name: "温控模板",
        imgurl:wudu,
        
    },
    {
        id: 2,
        name: "添加补货员",
        imgurl:add,
       
    },
    {
        id: 3,
        name: "点位管理",
        imgurl:dw,
       
    },
    {
        id: 4,
        name: "批量操作",
        imgurl:operate,
    }
];
const urlName=['/temperature'];
export default class taber extends PureComponent {
    constructor(props){
        super(props);

        this.state = {
            category,
            urlName
        }
    }

    componentDidMount() {
        
    }

    componentDidUpdate() {
    }

    render() {
        const { category } = this.state;
        return (
            <div className="taber">
                <div className="tabName">
                    <ul>
                        {
                            category.map((item, index) => {
                                return <li key={ index }  onClick={ this.checkTab.bind(this, item) }>
                                <img className='imgName'src={item.imgurl} alt="图标"></img>
                                <span className='itemName'>{ item.name }</span>
                                </li>
                            })
                        }
                    </ul>
                </div>
            </div>
        )
    }

    checkTab = (record) => {
        let str=this.state.urlName[record.id-1];
        this.props.history.push({
            pathname: str
        });
    };
}

